<template>
  <div class="paramsInfo">
    <c-desc title="产品参数" :columns="product" :data="productData"> </c-desc>
    <a-divider dashed />
    <c-desc title="其他参数" :columns="others" :data="quotationData">
      <template v-slot:createUsername>
        <span>{{ quotationData.createUsername }}</span>
      </template>
      <template v-slot:createDate>
        <span>{{ $getTime(quotationData.createDate) }}</span>
      </template>
    </c-desc>
  </div>
</template>

<script>
export default {
  props: {
    // 选中的商品id
    productId: {
      type: Number
    },
    // 报价信息
    quotationData: {
      type: Object,
      default: () => {
        return {};
      }
    }
  },
  data() {
    return {
      product: [
        {
          label: "商品",
          prop: "categoryName"
        },
        {
          label: "品牌",
          prop: "brand"
        },
        {
          label: "规格",
          prop: "spec"
        },
        {
          label: "材质",
          prop: "material"
        },
        {
          label: "其他",
          prop: "other"
        },
        {
          label: "仓库",
          prop: "warehouseShortName"
        },
        {
          label: "升贴水",
          prop: "premium"
        },
        {
          label: "数量",
          prop: "amountAvailable"
        }
      ],
      others: [
        {
          label: "下单倍数",
          prop: "rateLimit"
        },
        {
          label: "交货方式",
          prop: "deliveryType"
        },
        {
          label: "结算方式",
          prop: "settlementType"
        },
        {
          label: "开票日期",
          prop: "invoiceType"
        },
        {
          label: "发布人",
          prop: "createUsername",
          slot: "createUsername"
        },
        {
          label: "发布日期",
          prop: "createDate",
          slot: "createDate"
        },
        {
          label: "供应商",
          prop: "companyName"
        },
        {
          label: "备注",
          prop: "remark"
        }
      ]
    };
  },
  computed: {
    productData() {
      let res = {};
      this.quotationData.quotationDetailList.forEach(item => {
        if (item.id === this.productId) {
          res = {
            ...item,
            categoryName: this.quotationData.categoryName
          };
        }
      });
      return res;
    }
  }
};
</script>

<style lang="scss" scoped>
::v-deep .ant-descriptions-item > span {
  font-size: 15px;
}
</style>
